<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
		<title>我的中奖纪录</title>
		<link rel="stylesheet" type="text/css" href="./css/shake_index.css"/>
		<style type="text/css">
			*{margin:0;padding:0;}
			body{background:#efeff4;min-height:100%;}
			*{margin:0;padding:0;}
			.mask3{position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,0.7);z-index:9998;display:none;}
			/*垂直居中(不知高度也可)*/
			.popup{width:6rem;height:6.2rem;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;}
			.popupTitle{display:flex;justify-content:center;padding-top:0.5rem;}
			.popupTitle img{width:3.32rem;height:0.34rem;}
			.popupInput1{display:flex;justify-content:center;margin-top:0.5rem;position:relative;}
			.popupInput1 #carNum{width:90%;height:0.7rem;border:0;background:#eeeeee;font-size:0.26rem;text-indent:0.4rem;} 
			.popupInput1 img{width:0.17rem;height:0.3rem;position:absolute;right:0.5rem;top:0.2rem;}
			#carNum::placeholder{text-indent:0.4rem;font-size:0.26rem;line-height:0.26rem;}
			#carNum:focus{text-indent:0.4rem;}
			.popupInput2{display:flex;justify-content:center;margin:0 auto;margin-top:0.5rem;position:relative;width:90%;}
			.popupInput2 #carType{width:100%;height:0.7rem;border:0;background:#eeeeee;font-size:0.26rem;text-indent:0.4rem;padding-right:0.9rem;
			display: inline;white-space:nowrap;overflow-x:scroll;float:left;overflow-y:hidden;
			} 			 
			#carType::placeholder{text-indent:0.4rem;font-size:0.26rem;line-height:0.26rem;}
			#carType:focus{text-indent:0.4rem;}
			.popupInput2 img{width:0.17rem;height:0.3rem;position:absolute;right:0.2rem;top:0.2rem;}
			.popupEnsure{width:4.43rem;height:1.28rem;background:url('./image/shake/btnBg.png') no-repeat center;background-size:4.43rem 1.28rem;margin:0.5rem auto;display:flex;justify-content:center;}
			.popupEnsure p{align-self:center;font-size:0.26rem;color:#fff;margin-bottom:0.2rem;}
			.popupExplain{width:90%;display:flex;flex-flow:column;justify-content:center;margin:-0.5rem auto 0.1rem auto;}
			.popupExplain p{font-size:0.24rem;color:#999;text-align:left;}			
			.close img{width:0.7rem;height:0.7rem;margin:0.8rem auto;display: block;}			
			.awardLists{width:7.03rem;height:1.85rem;display:flex;margin:0.2rem auto;background:url('./image/shake/ticketBg.png') no-repeat;background-size:7.03rem 1.85rem;}		    
			.awardList1{width:2.31rem;height:1.85rem;display:flex;justify-content:center;}
			.awardList1 p{font-size:0.8rem;color:#fff;align-self:center;}
			.awardList1 p span{font-size:0.3rem;color:#fff;}
			.awardList2{width:2.72rem;height:1.85rem;display:flex;flex-flow:column;justify-content:center;}
			.awardList2_1 p{width:2.72rem;font-size:0.32rem;color:#fff;margin-bottom:0.28rem;}
			.awardList2_2 p{width:2.72rem;font-size:0.22rem;color:#fff;margin-bottom:0.1rem;}
			.awardList2_3 p{width:3.72rem;font-size:0.22rem;color:#fff;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:;-webkit-box-orient:vertical;}
			.awardList3{width:2rem;height:1.85rem;display:flex;justify-content:center;}
			.awardList3 p{align-self:center;width:1.68rem;height:0.56rem;font-size:0.28rem;color:#5203D0;border-radius:0.28rem;background:#fff;text-align:center;line-height:0.58rem;}
			.no_record{margin:2rem;display:none;}
			.no_record img{width:2rem;height:1.88rem;display:block;margin:0 0 0.2rem 0.7rem;}
			.no_record p{text-align:center;font-size:0.28rem;color:#000;}
			/* 弹出框 */
			.promptBox{
			    width: 5rem;
			    background: #fff;
			    position: fixed;
			    top: 50%;
			    left: 50%;
			    margin-top: -2rem;
			    margin-left: -2.5rem;
			    z-index: 9999;
			    border-radius: .2rem;
			    box-sizing: border-box;
			    padding: .5rem;
			    overflow: hidden;
			    font-size: .4rem;
			    text-align: center;  
			    display: none;
			}
			.secondary{
				font-size: .25rem;
				line-height: .4rem;
			}
			.iKnow{
			    background: #7f43fe;
			    color: #fff;
			    width: 3rem;
			    font-size: .4rem;
			    line-height: .7rem;
			    text-align: center;
			    border-radius: .2rem;
			    margin: .5rem auto 0;
			}
			.headers{
				height: 0.8rem;
				width: 7.5rem;
				display: flex;
				align-items: center;
				padding: 0 0.3rem;
				justify-content: space-between;
				border-bottom: 1px solid #ddd;
				background: #fff;
				box-sizing: border-box;
			}
			.headers span{
				width: 0.2rem;
				height: 0.2rem;
				border:1px solid #999;
				border-width: 0 0 1px 1px;
				transform: rotate(45deg);
			}
			.headers label{
				width: 0.6rem;
				height: 0.2rem;
				display: block;
			}
			.headers h1{
				font-size: 0.35rem;
				color: #333;
			}
		</style>
		<script type="text/javascript" src="./js/rem.js"></script>		
		<script type="text/javascript">
			var phone=getCookie('phone');
			var _Global_=getCookie('siteFrom');
		</script>
	</head>

	<body>		
		<div class="mask"></div>
		<div class="containers">
			<div class="headers">
				<span></span>
				<h1>中奖记录</h1>
				<label></label>
			</div>
			<div class="no_record">
				<img src="./image/shake/norecord.png"alt="" />			
				<p onclick="location.href='./shake_index.html'">暂无抽奖记录，点我去抽奖</p>					
			</div>
		</div>
		
		<div class="mask3">
			<div class="popup">
				<div class="popupTitle">
					<img src="./image/shake/activeMaintain.png" alt="" />
				</div>
				<div class="popupInput">
					<div class="popupInput1">
						<input type="text" id="carNum" name="carNum" placeholder="请输入车牌号" onblur="inputCarNum()"/>
						<img src="./image/shake/rightArrow.png" alt="" />
					</div>
					<div class="popupInput2">
						<input type="text" id="carType" class="cardX" name="carType" placeholder="请选择车型" readonly onfocus="location.href='./selectCar/carBrand.html'"/>						
						<img src="./image/shake/rightArrow.png" alt="" />
					</div>	
				</div>
				<div class="popupEnsure" id="ensure">
					<p>确认</p>
				</div>
				<div class="popupExplain">
					<p>1、请填写正确的车辆信息，提交后将无法修改</p>
					<p>2、激活后可在我的：我的-保养年卡中查看</p>
				</div>
				<div class="close">
					<img src="./image/shake/close2.png" alt="" id="close"/>
				</div>
			</div>			
		</div>
		<!-- 提示弹出框 -->
		<div class="promptBox">
			<p class="firstary"></p>
			<p class="secondary"></p>
			<div class="iKnow">知道了</div>
		</div>
			
	</body>
	<script src="http://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
		<script type="text/javascript" src="http://carnt.carnettong.com:8088/CARNT/js/cookie.js"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js">
		</script>
		<!-- 二次封装跳转 -->
		<script src="./js/H5AppOpen.js"></script>

		<script type="text/javascript" src="./js/award_record.js"></script>
</html>